//
//  ContentView.swift
//  Mirco_WidgetLab
//
//  Created by Liangyz on 2023/8/5.
//

import ClockHandRotationKit
import SwiftUI

struct Rectangle1: View {
    var offset: CGFloat = 60
    var scale: CGFloat = 1
    var size: CGSize = CGSize(width: 30, height: 30)
    var body: some View {
        ZStack(alignment: .center) {
            //创建一个旋转的遮罩，渐变色或者图片，大小要大于药丸屏，添加到药丸屏下面
            Rectangle()
                .fill(LinearGradient(colors: [.red,.yellow,.white,.green,.blue], startPoint: .leading, endPoint: .trailing))
                .frame(width: 200,height: 200)
                .clockHandRotationEffect(period: .custom(4))
            //药丸背景
            RoundedRectangle(cornerSize: CGSize(width: 18, height: 18))
                .frame(width: 183,height: 36)
        }
        .frame(width: 191,height: 44)
        .clipped()
        .cornerRadius(22)
        .rotation3DEffect(.degrees( 60), axis: (x: 1, y: -0.8, z: 0.6))

    }
}

struct EarthView: View {

    @State private var isFlipped = false

    var body: some View {
        ZStack {
            ForEach(0..<15) { i in
                Image(systemName: "globe")
                    .resizable()
                    .frame(width: 10,height: 10)
                    .offset(x: 40,y: 0)
                    .clockHandRotationEffect(period: .custom(-10))
                Circle()
                    .stroke(Color.red, lineWidth: 1)
                    .frame(width: 80,height: 80)
            }
           
        }
        .rotation3DEffect(.degrees( 70), axis: (x: 1, y: -0.8, z: 0.6))
//        .rotation3DEffect(.degrees( 80), axis: (x: 0.8, y: 0, z: 0))
        
       
    }
}

struct ParticleImageView: View {
    var particleSize: CGFloat = 5 // 粒子大小
    var particleColor: Color = .red // 粒子颜色

    var body: some View {
        Image(uiImage: generateParticleImage())
            .resizable()
            .frame(width: 200, height: 200)
    }
    
    private func generateParticleImage() -> UIImage {
        let renderer = UIGraphicsImageRenderer(size: CGSize(width: particleSize, height: particleSize))
        
        let image = renderer.image { context in
            let path = UIBezierPath(ovalIn: CGRect(x: 0, y: 0, width: particleSize, height: particleSize))
               
//            particleColor.uiColor.setFill() // 将 Color 转换为 UIColor
            path.fill()
        }
        
        return image
    }
}

struct LRDrinkWidgetView: View {
    
    var body: some View {
        ZStack(){
            let offsetX:CGFloat = 45
            let offsetY:CGFloat = 45
            let width: CGFloat = 120
            let height: CGFloat = 120
            let shouldHidden: Bool = true
            let rotation: CGFloat = 45
//            if shouldHidden {
//                ZStack(){
//                    RoundedRectangle(cornerSize: CGSize(width: 0, height: 0))
//                        .fill(Color.green.opacity(0.7))
//                        .frame(width: width,height: height-4)
//                        .offset(x:offsetX,y: -offsetY)
//                        .clockHandRotationEffect(period: .custom(8))
//                    RoundedRectangle(cornerSize: CGSize(width: 0, height: 0))
//                        .fill(Color.red.opacity(0.7))
//                        .frame(width: width,height: height-4)
//                        .offset(x:-offsetX,y: offsetY)
//                        .clockHandRotationEffect(period: .custom(8))
//                }
//                .rotationEffect(Angle(degrees: rotation))
//            }
            ZStack() {
                //药丸背景
                RoundedRectangle(cornerSize: CGSize(width: 30, height: 30))
                    .frame(width: 192,height: 52)
                //环绕光条（纯色，图片，渐变色都可以）
                LinearGradient(colors: [.red,.yellow,.white,.green,.blue], startPoint: .leading, endPoint: .trailing)
//                Image(uiImage: UIImage(named: "logo111") ?? UIImage())
                    .mask(
                        RoundedRectangle(cornerSize: CGSize(width: 30, height: 30))
                            .stroke(lineWidth: 4)
                            .frame(width: 200-4,height: 60-4)
                            .mask(
                                ZStack(){
                                    Color.red
                                        .frame(width: width,height: height-4)
                                        .offset(x:offsetX,y: -offsetY)
                                        .clockHandRotationEffect(period: .custom(8))
                                    Color.red
                                        .frame(width: width,height: height-4)
                                        .offset(x:-offsetX,y: offsetY)
                                        .clockHandRotationEffect(period: .custom(8))
                                }
                                    .rotationEffect(Angle(degrees: rotation))
                            )
                    )
            }
            
            .frame(width: 200,height: 60)
            .clipped()
           
        }
    }
}

struct TestView: View {
    let size: CGSize = CGSize(width: 30, height: 30)
    @State var offsetX: CGFloat = 60
    @State var scale: CGFloat = 5
    var body: some View {
        ZStack {
            Color.orange
                .frame(width: 240, height: 120)
                .overlay {
                    ZStack {
                        Rectangle()
                            .frame(width: 20,height: 20)
//                        Rectangle1(offset: offsetX, scale: scale, size: size)
                            .foregroundColor(.blue.opacity(1))
                            .offset(x: 0,y: 20)
                        
                      
                    }
                    .clockHandRotationEffect(period: .custom(-scale * 2.0), in: .current, anchor: .center)
                }
                .clipped()

            controlView
        }
    }
}

extension TestView {
    @ViewBuilder
    private var controlView: some View {
        VStack {
            Spacer()
            Slider(value: $offsetX, in: -120 ... 240, step: 30) {
                Text("OffsetX")
            } onEditingChanged: { _ in
            }
            .padding(.horizontal, 50)
            .padding(.bottom, 50)
            Slider(value: $scale, in: 0 ... 4, step: 0.001) {
                Text("Scale")
            } onEditingChanged: { _ in
            }
            .padding(.horizontal, 50)
            .padding(.bottom, 50)
        }
    }
}

struct ContentView: View {
    var body: some View {
//        TestView()
//        Rectangle1()
//        LRDrinkWidgetView()
        EarthView()
//        ParticleImageView()
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
